.container{
  position: relative;
  overflow: hidden;
}

.container .image-slider{
  display: flex;
  overflow-x: scroll;
  scroll-behavior: smooth;   /*动画效果*/
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory; /*强制在x抽，吸附*/
}

.container img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  scroll-snap-align: start;  /*对齐方式图片的start*/
}


.nav-section{
  position: absolute;
  bottom: 0;
  width: 100%;
  opacity: 0.5;
  color: #fff;
  background-color: #000;
  display: flex;
  justify-content: flex-end;
  align-items: stretch;
}


.nav-section .slide-button{
  display: flex;
  width: 10px;
  height: 10px;
  background-color: #fff;
  text-decoration: none;
  border-radius: 50%;
  margin: 5px;
}

.nav-section .slide-button-seleted{
background-color: red;
}
